<template>
    <div class="storeInfo-container">
        <div class="img-info" >
            <img :src="infoList.img_url"/>
            <img class="log-img" :src="infoList.log_img"/>
        </div>
        <div class="content">
            <div class="content-info">
            <p class="title">{{infoList.store_name}}</p>
            <p class="remark">{{infoList.remark}}</p>
        </div>
            <div class="aLine">.</div>
            <div class="detail-info">
                <p class="details"><Icon type="ios-pin-outline" size="20"/><span class="mg">单位名称</span>{{infoList.property_name}}</p>
                <p class="details" style="margin-top: 10px;"><Icon type="md-time" size="20"/><span class="mg">营业时间</span>{{infoList.business_hours}}</p>
                <p class="details" style="margin-top: 10px;"><Icon type="ios-call-outline" size="20"/><span class="mg">联系电话</span>{{infoList.telephone}}</p>
            </div>
        </div>
    </div>
</template>

<script>
  import axios from 'axios'
  export default {
    name: 'storeInfo',
    created (){
      this.getStoreInfo()
    },
    methods: {
      getStoreInfo () {
        this.code = this.$route.query.store_code
        // this.code = 'G04BL180001'
        console.log(this.code)
        axios.get('https://vip.gznewpark.com/dist/admin/public/index.php/wx/Shop/storeInfo'+ '?store_code=' + this.code).then(res => {
          this.infoList = res.data.result
          console.log(this.infoList)
        })
      }
    },
    data () {
      return {
        code: '',
        infoList: []
      }
    }
  }
</script>

<style lang="less">
    body {
        width: 100%;
        height: 100%;
        background-color: #fff!important;
    }
    .storeInfo-container {
        width: 100%;
        height: 100%;
        background-color: #fff;
    }
.storeInfo-container img{
    width: 100%;
    height: 100%;
}
   .img-info .log-img{
        width:100px;
        height:100px;
        border: 5px solid #fff;
        z-index: 1;
        margin-top: -50%;
        margin-right: -60%;
    }
.content{
    margin:5% 10%;
}
    .content-info{
        margin-bottom: 20px;
    }
.content-info .title{
        font-size: 20px;
        text-align: left;
        color: #11abde;
    }
.content-info .remark{
    margin-top: 5%;
    font-size: 14px;
    text-align: left;
}
.detail-info{
    margin-top: 20px;
}
   .detail-info .details{
        font-size: 14px;
        text-align: left;
    }
   .details{
       color: #515a6e;
   }
    .details .mg{
        margin: 0 5px 0 10px;
    }
    .aLine{
        width: 100%;
        height: 2px;
        color: transparent;
        border: 1px solid #515a6e;
    }
</style>